<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:p="http://primefaces.prime.com.tr/ui">

<ui:composition>
	<h:form prependId="false">

		<p:growl id="messages" showDetail="true" />

		<p:dataTable var="items" value="#{mProperty.allProp}" paginator="true"
			paginatorAlwaysVisible="false" id="prop_table" rows="10"
			dynamic="true" onRowEditUpdate="messages"
			rowEditListener="#{mProperty.statusRowUpdate()}">



			<p:column>
				<f:facet name="header"></f:facet>
				<p:rowToggler />
			</p:column>

			<p:column sortBy="#{items.postDate}">
				<f:facet name="header">Post Date</f:facet>

				<h:outputText value="#{items.postDate}" />
			</p:column>

			<p:column sortBy="#{items.title}" filterBy="#{items.title}" filterMatchMode="contains">
				<f:facet name="header">Title</f:facet>
				<h:outputText value="#{items.title}" />
			</p:column>

			<p:column sortBy="#{items.account.name}"
				filterBy="#{items.account.name}" filterMatchMode="contains">
				<f:facet name="header">Owner</f:facet>
				<h:outputText value="#{items.account.name}" />
			</p:column>

			<p:column style="width:150px" sortBy="#{items.status}">
				<f:facet name="header">Status</f:facet>
				<p:cellEditor>
					<f:facet name="output">
						<h:outputText value="#{mProperty.validStatus(items.status)}" />
					</f:facet>
					<f:facet name="input">
						<h:selectOneMenu value="#{items.status}" style="width: 100px">
							<f:selectItem itemValue="true" itemLabel="Active" />
							<f:selectItem itemValue="false" itemLabel="Deactive" />
						</h:selectOneMenu>
					</f:facet>
				</p:cellEditor>
			</p:column>

			<p:column headerText="Options">
				<p:rowEditor />
			</p:column>

			<p:rowExpansion>
				<div class="box3">
					<div class="image_box">
						<h:graphicImage value="#{mProperty.getPath(items.propID)}"
							width="150px" height="150px"></h:graphicImage>
					</div>
					<div class="prop_info">
						<ul class="list1">
							<li><strong>Owner: </strong> <h:outputText
									value="#{items.account.name}" /></li>
							<li><strong>Country: </strong> <h:outputText
									value="#{items.country}" /></li>
							<li><strong>State: </strong> <h:outputText
									value="#{items.state}" /></li>
							<li><strong>Address: </strong> <h:outputText
									value="#{items.address}" /></li>
							<li><strong>ID: </strong> <h:outputText
									value="#{items.propID}" /></li>
						</ul>
					</div>
					<span class="details_link"> <a4j:commandLink
							styleClass="no-decor"
							render="#{mProperty.getPropType(items)}_editPanel"
							execute="@this"
							oncomplete="#{mProperty.getPropType(items)}_dlg.show()"> <h:graphicImage value="/resources/images/search-icon.gif"> 
							<b style="color:white">View Details</b> 
						</h:graphicImage>
								<f:setPropertyActionListener target="#{mProperty.prop}"
								value="#{items}" />
						</a4j:commandLink> </span>
				</div>
			</p:rowExpansion>
		</p:dataTable>

		<p:dialog header="Property For Rent Details" widgetVar="P_dlg"
			modal="true" hideEffect="puff" showEffect="puff" id="P_dlg"
			resizable="false" minWidth="700">
			<p:outputPanel id="P_editPanel" layout="block">
				<table>
					<tr>
						<td width="180px" rowspan="2"><p:imageSwitch effect="fade">
								<ui:repeat
									value="#{mProperty.getAllPath(mProperty.prop.propID)}"
									var="image">
									<p:graphicImage value="#{image}" width="150px" height="150px" />
								</ui:repeat>
							</p:imageSwitch></td>
						<td align="left" width="300px"><ul class="list1">
								<li><strong>Owner: </strong> <h:outputText
										value="#{mProperty.prop.account.name}" /></li>
								<li><strong>Title: </strong> <h:outputText
										value="#{mProperty.prop.title}" /></li>
								<li><strong>Country: </strong> <h:outputText
										value="#{mProperty.prop.country}" /></li>
							</ul>
						</td>
						<td align="left"><ul class="list1">
								<li><strong>ID: </strong> <h:outputText
										value="#{mProperty.prop.propID}" /></li>
								<li><strong>Status: </strong> <h:outputText
										value="#{mProperty.validStatus(mProperty.prop.status)}" /></li>
								<li><strong>State: </strong> <h:outputText
										value="#{mProperty.prop.state}" /></li>
							</ul>
						</td>
					</tr>
					<tr>
						<td colspan="2"><ul class="list1">
								<li><strong>Address: </strong> <h:outputText
										value="#{mProperty.prop.address}" /></li>
							</ul>
						</td>
					</tr>
					<tr>
						<td colspan="3"><p:separator
								style="height:2px;width:670px;color:#8b9082;" />
						</td>
					</tr>

					<tr>
						<td align="left"><ul class="list1">
								<li><strong>BedRoom: </strong> <h:outputText
										value="#{mProperty.prop.propForRent.bedRoom}" /></li>
								<li><strong>BathRoom: </strong> <h:outputText
										value="#{mProperty.prop.propForRent.bathRoom}" /></li>
								<li><strong>Deposit (Australia Dollar): </strong> <br /> <h:outputText
										value="#{mProperty.prop.propForRent.deposit}" /></li>
								<li><strong>Rent (Australia Dollar): </strong> <h:outputText
										value="#{mProperty.prop.propForRent.rent}" /></li>
								<li><strong>Payment: </strong> <h:outputText
										value="#{mProperty.prop.propForRent.payment}" />
								</li>
							</ul>
						</td>
						<td align="left" colspan="2"><h2>Description:</h2> <br /> <h:outputText
								value="#{mProperty.prop.description}" />
						</td>
					</tr>
				</table>
			</p:outputPanel>
		</p:dialog>

		<p:dialog header="Property For Sale Details" widgetVar="S_dlg"
			modal="true" hideEffect="puff" showEffect="puff" id="S_dlg"
			resizable="false" minWidth="700">
			<p:outputPanel id="S_editPanel" layout="block">
				<table>
					<tr>
						<td width="180px" rowspan="2"><p:imageSwitch effect="fade">
								<ui:repeat
									value="#{mProperty.getAllPath(mProperty.prop.propID)}"
									var="image">
									<p:graphicImage value="#{image}" width="150px" height="150px" />
								</ui:repeat>
							</p:imageSwitch></td>
						<td align="left" width="300px"><ul class="list1">
								<li><strong>Owner: </strong> <h:outputText
										value="#{mProperty.prop.account.name}" /></li>
								<li><strong>Title: </strong> <h:outputText
										value="#{mProperty.prop.title}" /></li>
								<li><strong>Country: </strong> <h:outputText
										value="#{mProperty.prop.country}" /></li>
								<li><strong>Type: </strong> <h:outputText
										value="#{mProperty.prop.propForSale.type}" /></li>
								<li><strong>Square: </strong> <h:outputText
										value="#{mProperty.prop.propForSale.square}" /></li>
							</ul>
						</td>
						<td align="left"><ul class="list1">
								<li><strong>ID: </strong> <h:outputText
										value="#{mProperty.prop.propID}" /></li>
								<li><strong>Status: </strong> <h:outputText
										value="#{mProperty.validStatus(mProperty.prop.status)}" /></li>
								<li><strong>State: </strong> <h:outputText
										value="#{mProperty.prop.state}" /></li>
								<li><strong>Has Interior: </strong> <h:outputText
										value="#{mProperty.prop.propForSale.hasInterior}" /></li>
								<li><strong>Facility: </strong> <h:outputText
										value="#{mProperty.prop.propForSale.facility}" /></li>
							</ul>
						</td>
					</tr>
					<tr>
						<td colspan="2"><ul class="list1">
								<li><strong>Address: </strong> <h:outputText
										value="#{mProperty.prop.address}" /></li>
							</ul>
						</td>
					</tr>
					<tr>
						<td colspan="3"><p:separator
								style="height:2px;width:670px;color:#8b9082;" />
						</td>
					</tr>

					<tr>
						<td align="left"><ul class="list1">
								<li><strong>Transport: </strong> <h:outputText
										value="#{mProperty.prop.propForSale.transport}" /></li>
								<li><strong>BedRoom: </strong> <h:outputText
										value="#{mProperty.prop.propForSale.bedroom}" /></li>
								<li><strong>BathRoom: </strong> <h:outputText
										value="#{mProperty.prop.propForSale.bathroom}" /></li>
								<li><strong>Price (Australia Dollar): </strong> <h:outputText
										value="$#{mProperty.prop.propForSale.price}" /></li>
								<li><strong>Payment: </strong> <h:outputText
										value="#{mProperty.prop.propForSale.payment}" /></li>
							</ul>
						</td>
						<td align="left" colspan="2"><h2>Description:</h2> <br /> <h:outputText
								value="#{mProperty.prop.description}" />
						</td>
					</tr>
				</table>
			</p:outputPanel>
		</p:dialog>

		<p:dialog header="Room For Rent Details" widgetVar="R_dlg"
			modal="true" hideEffect="puff" showEffect="puff" id="R_dlg"
			resizable="false" minWidth="700">
			<p:outputPanel id="R_editPanel" layout="block">
				<table>
					<tr>
						<td width="180px" rowspan="2"><p:imageSwitch effect="fade">
								<ui:repeat
									value="#{mProperty.getAllPath(mProperty.prop.propID)}"
									var="image">
									<p:graphicImage value="#{image}" width="150px" height="150px" />
								</ui:repeat>
							</p:imageSwitch></td>
						<td align="left" width="300px"><ul class="list1">
								<li><strong>Owner: </strong> <h:outputText
										value="#{mProperty.prop.account.name}" /></li>
								<li><strong>Title: </strong> <h:outputText
										value="#{mProperty.prop.title}" /></li>
								<li><strong>Country: </strong> <h:outputText
										value="#{mProperty.prop.country}" /></li>
							</ul>
						</td>
						<td align="left"><ul class="list1">
								<li><strong>ID: </strong> <h:outputText
										value="#{mProperty.prop.propID}" /></li>
								<li><strong>Status: </strong> <h:outputText
										value="#{mProperty.validStatus(mProperty.prop.status)}" /></li>
								<li><strong>State: </strong> <h:outputText
										value="#{mProperty.prop.state}" /></li>
							</ul>
						</td>
					</tr>
					<tr>
						<td colspan="2"><ul class="list1">
								<li><strong>Address: </strong> <h:outputText
										value="#{mProperty.prop.address}" /></li>
							</ul>
						</td>
					</tr>
					<tr>
						<td colspan="3"><p:separator
								style="height:2px;width:670px;color:#8b9082;" />
						</td>
					</tr>

					<tr>
						<td align="left"><ul class="list1">
								<li><strong>Deposit (Australia Dollar): </strong> <br /> <h:outputText
										value="#{mProperty.prop.roomForRent.deposit}" /></li>
								<li><strong>Rent (Australia Dollar): </strong> <br /> <h:outputText
										value="#{mProperty.prop.roomForRent.rent}" /></li>
							</ul>
						</td>
						<td align="left" colspan="2"><h2>Description:</h2> <br /> <h:outputText
								value="#{mProperty.prop.description}" />
						</td>
					</tr>
				</table>
			</p:outputPanel>
		</p:dialog>

	</h:form>
</ui:composition>
</html>